import React from 'react';

class Gift extends React.Component{
    constructor(props){
        super(props);
    }
    render(){
        return(
            <div>
            <div className="gift-list-container">
                <ul className="gift-list">
                    <li>
                        <img src={require("./static/images/list1.jpg")}/>
                        <div className="gift-info">
                            <p>京东卡200</p>
                            <p>需要饿币:  <span>20</span> </p>
                            <p>已兑换:  <span>17</span> 个</p>
                            <p>还有库存  <span>20</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list2.jpg")}/>
                        <div className="gift-info">
                            <p>京东卡500</p>
                            <p>需要饿币:  <span>50</span> </p>
                            <p>已兑换:  <span>16</span> 个</p>
                            <p>还有库存  <span>8</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list3.jpg")}/>
                        <div className="gift-info">
                            <p>京东卡1000</p>
                            <p>需要饿币:  <span>100</span> </p>
                            <p>已兑换:  <span>10</span> 个</p>
                            <p>还有库存  <span>3</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list4.jpg")}/>
                        <div className="gift-info">
                            <p>饿了么玩偶一个</p>
                            <p>需要饿币:  <span>4</span> </p>
                            <p>已兑换:  <span>5</span> 个</p>
                            <p>还有库存  <span>48</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list5.jpeg")}/>
                        <div className="gift-info">
                            <p>饿了么书包（2016纪念版）</p>
                            <p>需要饿币:  <span>7</span> </p>
                            <p>已兑换:  <span>5</span> 个</p>
                            <p>还有库存  <span>8</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list6.jpg")}/>
                        <div className="gift-info">
                            <p>现金100元</p>
                            <p>需要饿币:  <span>10</span> </p>
                            <p>已兑换:  <span>246</span> 个</p>
                            <p>还有库存  <span>20</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list7.png")}/>
                        <div className="gift-info">
                            <p>饿了么会员卡（月卡）</p>
                            <p>需要饿币:  <span>2</span> </p>
                            <p>已兑换:  <span>15</span> 个</p>
                            <p>还有库存  <span>40</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list8.jpeg")}/>
                        <div className="gift-info">
                            <p>欧莱雅水能保湿温润乳+控油炭爽净亮洁面膏</p>
                            <p>需要饿币:  <span>11</span> </p>
                            <p>已兑换:  <span>0</span> 个</p>
                            <p>还有库存  <span>10</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list9.jpeg")}/>
                        <div className="gift-info">
                            <p>韩国可莱丝针剂水库面膜10片</p>
                            <p>需要饿币:  <span>10</span> </p>
                            <p>已兑换:  <span>3</span> 个</p>
                            <p>还有库存  <span>18</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list10.jpg")}/>
                        <div className="gift-info">
                            <p>500元中银通卡</p>
                            <p>需要饿币:  <span>50</span> </p>
                            <p>已兑换:  <span>0</span> 个</p>
                            <p>还有库存  <span>8</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list11.jpeg")}/>
                        <div className="gift-info">
                            <p>1000元中银通卡</p>
                            <p>需要饿币:  <span>100</span> </p>
                            <p>已兑换:  <span>0</span> 个</p>
                            <p>还有库存  <span>8</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list12.png")}/>
                        <div className="gift-info">
                            <p>定制餐具</p>
                            <p>需要饿币:  <span>4</span> </p>
                            <p>已兑换:  <span>0</span> 个</p>
                            <p>还有库存  <span>10</span> 件</p>
                        </div>
                    </li>
                    <li>
                        <img src={require("./static/images/list13.jpg")}/>
                        <div className="gift-info">
                            <p>运动手环</p>
                            <p>需要饿币:  <span>10</span> </p>
                            <p>已兑换:  <span>0</span> 个</p>
                            <p>还有库存  <span>10</span> 件</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div className="esrc-footer">
                 Copyright © 2015 
                 <a href="http://www.ele.me">Ele.me</a>
                 . All Rights Reserved 
            </div>
            </div>
        )
    }
}


export default Gift;